.pageLoading {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;

  & :global {
    .loader {
      width: 50px;
      height: 165px;
      position: relative;
    }
    .loader::before {
      content: "";
      position: absolute;
      left: 50%;
      top: 0;
      transform: translate(-50%, 0);
      width: 16px;
      height: 16px;
      background: #ff3d00;
      border-radius: 50%;
      animation: pageLoadingBounce 2s linear infinite;
    }
    .loader::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      margin: auto;
      height: 48px;
      width: 48px;
      background: var(--foreground);
      border-radius: 4px;
      animation: pageLoadingRotate 2s linear infinite;
    }
  }
}
